<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="../../vendor/bootstrap3/css/bootstrap.min.css">
    <title>Title</title>
</head>
<body ng-app>
<!--居中-->
<div class="container" ng-controller="cartController">
    <table class="table">
        <thead>
        <tr>
            <th>产品编号</th>
            <th>产品名字</th>
            <th>购买数量</th>
            <th>产品单价</th>
            <th>产品总价</th>
            <th>操作</th>
        </tr>
        </thead>
        <tbody>
        <tr ng-repeat="item in cart">
            <td>{{item.id}}</td>
            <td>{{item.name}}</td>
            <td><button type="button" class="btn btn-primary" ng-click="reduce(item.id)">-</button>
                <input ng-model="item.quantity" type="text" value="{{item.quantity}}">
                <button type="button" class="btn btn-primary" ng-click="add(item.id)">+</button>
            </td>
            <td>{{item.price}}</td>
            <td>{{item.quantity * item.price}}</td>
            <td>
                <button type="button" class="btn btn-danger" ng-click="remove(item.id)">移除</button>
            </td>
        </tr>
        <tr>
            <td>总购买价</td>
            <td>{{totalPrice()}}</td>
            <td>总购买数量</td>
            <td>{{totalQuantity()}}</td>
            <td colspan="2">
                <button type="button" class="btn btn-danger" ng-click="cart = {}">清空购物车</button>
            </td>
        </tr>
        </tbody>
    </table>
</div>
<script type="text/javascript" src="app/index.js"></script>
<script type="text/javascript" src="../../vendor/angular/angularjs.js"></script>

</body>
</html>